<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="订单日期">
          <el-date-picker type="daterange" v-model="queryParams.date1" range-separator="至" start-placeholder="开始日期"
          end-placeholder="结束日期" clearable style="width: 240px" />
      </el-form-item>

      <el-form-item label="单据号">
        <el-input v-model="queryParams.orderNo" placeholder="请输入单据号"></el-input>
      </el-form-item>

      <el-form-item label="销售员">
        <el-input v-model="queryParams.saleman" placeholder="请输入销售员"></el-input>
      </el-form-item>

      <el-form-item label="合同号">
        <el-input v-model="queryParams.contractNo" placeholder="请输入合同号"></el-input>
      </el-form-item>
      
      <el-row>
        <el-col :span="6">
           <el-form-item label="客户合同号">
             <el-input v-model="queryParams.customerContractNo" placeholder="请输入客户合同号" />
           </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="客户名称">
            <el-input v-model="queryParams.customerName" placeholder="请输入客户名称" />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item>
            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
          </el-form-item>
        </el-col>
      </el-row>

    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" size="mini" @click="handleAdd">新增</el-button>
        <el-button type="success" size="mini" @click="handleGenerateTask">生成生成任务单</el-button>
        <el-button type="info" size="mini" @click="handleCopyHistoryOrder">复制历史订单</el-button>
        <el-button type="warning" size="mini" @click="handleExport">导出</el-button>
      </el-col>
    </el-row>
    
    <el-tooltip placement="top">
      <div slot="content">点击任意一行列，即可在下方查看明细记录</div>
      <el-table :data="orderdata" v-loading="loading" @row-click="showTab" :row-class-name="rowClassName">
        <el-table-column align="center" label="单据号" prop="orderNo"></el-table-column>
        <el-table-column align="center" label="类型" prop="orderType"></el-table-column>
                 <!-- 金额 -->
        <el-table-column align="center" label="金额" prop="money"></el-table-column>
        <el-table-column align="center" label="合同号" prop="contractNo"></el-table-column>
        <el-table-column align="center" label="客户合同号" width="150" prop="customerContractNo"></el-table-column>
        <el-table-column align="center" label="订单日期" prop="orderDate"></el-table-column>
        <el-table-column align="center" label="客户名称" prop="customer"></el-table-column>
        <el-table-column align="center" label="销售员" prop="saleman"></el-table-column>
        <el-table-column align="center" label="是否特价" prop="isSpecialPrice"></el-table-column>
        <!-- <el-table-column align="center" label="合同金额" prop="totalAmount"></el-table-column> -->
        <el-table-column label="审核状态" prop="status"></el-table-column>
        <el-table-column label="操作" width="100" fixed="right"  align="center" >
          <template slot-scope="scope">
            <el-button type="text" size="mini" @click="handleDetail(scope.row)">反审核</el-button>
            <el-button type="text" size="mini" @click="handleReview(scope.row)">审核</el-button>
            <el-button type="text" size="mini" @click="handleUpdate(scope.row)">修改</el-button>
            <el-button type="text" size="mini" @click="handleDelete(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-tooltip>

    <pagination :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList"
      :total="total" />

    <el-tabs v-model="activeName" v-if="showCard">
      <el-tab-pane label="订单明细" name="first">
        <h2 align="center">{{ orderNo }}订单明细</h2>
        
        <el-row :gutter="10">
          <el-col :span="1.5">
            <el-button type="primary" size="mini" @click="handleAddComm">新增明细</el-button>
            <el-button type="info" size="mini" @click="handleCopyHistoryOrderComm">复制历史订单明细</el-button>
          </el-col>
        </el-row>
        
        <el-table :data="commdate">
          <el-table-column prop="id" label="序号" align="center" />
          <el-table-column label="产品描述" align="center">
            <el-table-column  prop="code" label="代号" align="center" />
            <el-table-column  prop="name" label="名称" align="center" />
            <el-table-column  prop="Spec" label="规格" align="center" />
            <el-table-column  prop="productType" label="产品类型" align="center" />
          </el-table-column>
          <el-table-column prop="productAttributes" label="产品属性" align="center" />
          <el-table-column prop="color" label="颜色" align="center" />
          <el-table-column prop="weight" label="单重" align="center" />
          <el-table-column prop="stitch" label="贴花方式" align="center" />
          <el-table-column prop="brand" label="商标" align="center" />
          <el-table-column label="促销" align="center" >
              <el-table-column prop="promotion" align="center" label="促销价" />
              <el-table-column prop="promotionstart" align="center" label="促销开始日期" />
              <el-table-column prop="promotionend" align="center" label="促销结束日期" />
          </el-table-column>
          <el-table-column prop="amount" label="装箱数" align="center" />
          <el-table-column prop="Mweight" label="毛重" align="center" />
          <el-table-column prop="netWeight" label="净重" align="center" />
          <el-table-column prop="grossWeight" label="体积" align="center" />
          <el-table-column prop="expiryDate" label="交货日期" align="center" />
          <el-table-column label="USD" align="center">
            <el-table-column  prop="usdPrice" label="单价(USD)" align="center" />
            <el-table-column  prop="usdAmount" label="金额(USD)" align="center" />
          </el-table-column>
          <el-table-column prop="deliveryDate" label="评审交期" align="center" />
          <el-table-column prop="sendGoods" label="已发货数" align="center" />
          <el-table-column prop="outbound" label="已出库数" align="center" />
          <el-table-column label="操作" width="150" fixed="right"  align="center" >
            <template slot-scope="scope">
              <el-button type="text" size="mini" @click="handleProductAttributes(scope.row)">设置产品属性</el-button>
              <el-button type="text" size="mini" @click="handleUpdateComm(scope.row)">修改</el-button>
              <el-button type="text" size="mini" @click="handleDeleteComm(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="订单明细要求" name="second">
        <el-row :gutter="20">
          <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
            <pane size="32">
            <el-tooltip placement="top">
              <div slot="content">单击任意一行列即可查看详情订单要求</div>
             <el-table :data="commdate" @row-click="handleDetailClick">
                  <el-table-column prop="code" label="代号" align="center" />
                  <el-table-column prop="name" label="名称" align="center" />
                  <el-table-column prop="Spec" label="规格" align="center" />
                  <el-table-column prop="customerNo" label="客户货号" align="center" />
                  <el-table-column prop="productType" label="产品类型" align="center" />
              </el-table>
              </el-tooltip>
          </pane>
            <pane size="64">
              <el-row :gutter="10" class="mb8">
                <el-col :push='1' :span="1.5">
                  <el-button type="primary" size="mini" @click="handleAddSave">保存</el-button>
                </el-col>
              </el-row>
              <el-form ref="formOrderDetail" :model="formOrderDetail" label-width="80px">
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="产品组成" prop="productComposition">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                       <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails('产品组成','productComposition',formOrderDetail.productComposition)"></el-button>
                      </el-tooltip>
                      <el-input type="textarea" v-model="formOrderDetail.productComposition"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="包装要求" prop="packageRequirements">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                      <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails('包装要求','packageRequirements',formOrderDetail.packageRequirements)"></el-button>
                     </el-tooltip>
                        <el-input type="textarea" v-model="formOrderDetail.packageRequirements"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                
                <el-row>
                 <el-col :span="12">
                   <el-form-item label="品质要求" prop="qualityRequirements">
                    <el-tooltip content="针对所有明细产品同样设置" placement="top">
                      <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails('品质要求','qualityRequirements',formOrderDetail.qualityRequirements)"></el-button>
                     </el-tooltip>
                     <el-input type="textarea" v-model="formOrderDetail.qualityRequirements"></el-input>
                   </el-form-item>
                 </el-col>
                 <el-col :span="12">
                  
                   <el-form-item label="英文包装要求" prop="englishPackageRequirements">
                    <el-tooltip content="针对所有明细产品同样设置" placement="top">
                      <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails('英文包装要求','englishPackageRequirements',formOrderDetail.englishPackageRequirements)"></el-button>
                     </el-tooltip>
                     <el-input type="textarea" v-model="formOrderDetail.englishPackageRequirements"></el-input>
                   </el-form-item>
                 </el-col>
                </el-row>
                
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="封口方式" prop="sealingMethod">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                        <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails('封口方式','sealingMethod',formOrderDetail.sealingMethod)"></el-button>
                      </el-tooltip>
                      <el-input type="textarea" v-model="formOrderDetail.sealingMethod"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="打包方式" prop="packingMethod">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                        <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails( '打包方式','packingMethod',formOrderDetail.packingMethod)"></el-button>
                      </el-tooltip>
                      <el-input type="textarea" v-model="formOrderDetail.packingMethod"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="唛头" prop="marking">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                        <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails( '唛头','marking',formOrderDetail.marking)"></el-button>
                      </el-tooltip>
                      <el-input type="textarea" v-model="formOrderDetail.marking"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="纸箱材质" prop="paperMaterial">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                        <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails( '纸箱材质','paperMaterial',formOrderDetail.paperMaterial)"></el-button>
                      </el-tooltip>
                      <el-input type="textarea" v-model="formOrderDetail.paperMaterial"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
    
                
               </el-form>
            </pane>
          </splitpanes>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="产品图片" name="third">
        <el-row :gutter="20">
          <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
            <pane size="48">
              <el-table :data="commdate" @row-click="handleImgClick">
                  <el-table-column prop="code" label="代号" align="center" />
                  <el-table-column prop="name" label="名称" align="center" />
                  <el-table-column prop="Spec" label="规格" align="center" />
                  <el-table-column prop="customerNo" label="客户货号" align="center" />
                  <el-table-column prop="productType" label="产品类型" align="center" />
              </el-table>
            </pane>
            <pane size="48"> 
              <el-form ref="formImg" :model="formImg" label-width="80px">
                <el-form-item prop="img">
                   <ImageUpload v-model="img" /> 
                </el-form-item>
              </el-form>
            </pane>
          </splitpanes>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="物料清单设置" name="fourth">
        <el-row :gutter="20">
          <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
            <pane size="32">
              <el-table :data="commdate" @row-click="handleBOMClick">
                  <el-table-column prop="code" label="代号" align="center" />
                  <el-table-column prop="name" label="名称" align="center" />
                  <el-table-column prop="Spec" label="规格" align="center" />
                  <el-table-column prop="customerNo" label="客户货号" align="center" />
                  <el-table-column prop="productType" label="产品类型" align="center" />
                  <el-table-column label="操作" fixed="right"  align="center" >
                    <template slot-scope="scope">
                      <el-button type="text" size="mini" @click="handleAddBOM(scope.row)">生成订单BOM</el-button>
                    </template>
                  </el-table-column>
              </el-table>
              
              <el-row style="margin-top: 20px;" :gutter="10" class="mb8">
                <el-col :push="12" :span="1.5">
                  <el-button type="primary" size="mini" @click="handleGenerateBOM">一键生成BOM</el-button>
                </el-col>
              </el-row>
              
            </pane>
            <pane size="64">
              <el-row>
                <el-col :span="1.5">
                  <el-button type="primary" size="mini" @click="handleAddMaterial">新增物料</el-button>
                </el-col>
              </el-row>
              <el-table :data="materialData">
                <el-table-column label="物品描述" align="center" >
                  <el-table-column prop="code" label="代号" align="center" />
                  <el-table-column prop="name" label="名称" align="center" />
                  <el-table-column prop="quantity" label="材质" align="center" />
                  <el-table-column prop="unit" label="单位" align="center" />
                </el-table-column>
                <el-table-column  label="尺寸" align="center">
                  <el-table-column prop="length" label="长" align="center" />
                  <el-table-column prop="width" label="宽" align="center" />
                  <el-table-column prop="height" label="高" align="center" />
                </el-table-column>
                <el-table-column prop="productAttributes" label="产品属性" align="center" />
                <el-table-column prop="color" label="颜色" align="center" />
                <el-table-column prop="weight" label="单重" align="center" />
                <el-table-column prop="stitch" label="用量" align="center" />
                <el-table-column prop="deputiUnits" label="副单位" align="center" />
                <el-table-column prop="brand" label="花色" align="center" />
                <el-table-column prop="calculationDirection" label="计算方向" align="center" />
                <el-table-column label="操作" fixed="right"  align="center" >
                  <template slot-scope="scope">
                    <el-button type="text" size="mini" @click="handleEditMaterial(scope.row)">修改</el-button>
                    <el-button type="text" size="mini" @click="handleDeleteMaterial(scope.row)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </pane>
          </splitpanes>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="订单附件" name="fifth">
        <el-row :gutter="20">
          <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
            <pane size="64">
              <el-row :gutter="10" class="mb8">
                <el-col :span="1.5">
                  <el-button type="primary" size="mini" @click="handleAddFile">添加附件</el-button>
                </el-col>
              </el-row>
              <el-table :data="fileDate">
                  <el-table-column prop="fileNo" label="附件主题" align="center" />
                  <el-table-column prop="fileName" label="附件名称" align="center" />
                  <el-table-column prop="filePath" label="附件路径" align="center" >
                    <template slot-scope="scope">
                      <el-button size="mini" type="text" @click="handleDownload1(scope.row)">查看附件</el-button>
                    </template>
                  </el-table-column>
                  <el-table-column prop="fileType"  label="附件说明" align="center" />
                  <el-table-column label="附件操作" fixed="right"  align="center" >
                    <template slot-scope="scope">
                      <el-button type="text" size="mini" @click="handleFileDownload(scope.row)">下载</el-button>
                      <el-button type="text" size="mini" @click="handleFileDelete(scope.row)">删除</el-button>
                    </template>
                  </el-table-column>
              </el-table>
            </pane>
          </splitpanes>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="变更情况" name="sixth">
        <el-row :gutter="20">
          <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
            <pane size="64">
              <el-row :gutter="10" class="mb8">
                <el-col :span="1.5">
                  <el-button type="primary" size="mini" @click="handleAdd">添加变更</el-button>
                </el-col>
              </el-row>
              <el-table :data="changeDate">
                  <el-table-column prop="changeNumber" label="变更次数" align="center" />
                  <el-table-column prop="changeNo" label="变更单号" align="center" />
                  <el-table-column prop="changeDate" label="变更日期" align="center" />
                  <el-table-column prop="changeModifier" label="变更人" align="center" />
                  <el-table-column prop="changeContent" label="变更内容" align="center" />
                  <el-table-column label="变更操作" fixed="right"  align="center" >
                    <template slot-scope="scope">
                      <el-button type="text" size="mini" @click="handleEditChange(scope.row)">修改</el-button>
                      <el-button type="text" size="mini" @click="handleDeleteChange(scope.row)">删除</el-button>
                    </template>
                  </el-table-column>
              </el-table>
            </pane>
          </splitpanes>
        </el-row>
      </el-tab-pane>
      
    </el-tabs>
    <!-- 订单 -->
     <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
       <el-form ref="form" :model="form" label-width="100px">
        <el-row>
            <el-col :span="12">
              <el-form-item label="订单编号" prop="orderNo">
                <el-input style="width: 240px;" v-model="form.orderNo"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="类型" prop="orderType">
                <el-select style="width: 240px;" v-model="form.orderType">
                  <el-option label="外销" value="外销"></el-option>
                  <el-option label="内销" value="内销"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
        </el-row>
        
        <el-row>
          <el-col :span="12">
            <el-form-item label="合同号" prop="contractNo">
              <el-input style="width: 240px;" v-model="form.contractNo"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="客户合同号" prop="customerContractNo">
              <el-input style="width: 240px;" v-model="form.customerContractNo"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row>
          <el-col :span="12">
            <el-form-item label="订单日期" prop="orderDate">
              <el-date-picker style="width: 240px;" type="date" placeholder="选择日期" v-model="form.orderDate"></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="客户名称" prop="customer">
              <el-input style="width: 240px;" v-model="form.customer"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row>
          <el-col :span="12">
             <el-form-item label="销售员" prop="saleman">
               <el-input style="width: 240px;" v-model="form.saleman"></el-input>
             </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="审核状态" prop="status">
              <el-select style="width: 240px;" v-model="form.status">
                <el-option label="待审核" value="待审核"></el-option>
                <el-option label="审核通过" value="审核通过"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
         <!--  <el-col :span="12">
            <el-form-item label="封口方式" prop="sealingType">
              <el-select style="width: 240px;" v-model="form.sealingType">
                <el-option label="无封口" value="无封口"></el-option>
                <el-option label="封口" value="封口"></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
        </el-row>
        
        <el-row>
          <el-col :span="12">
            <el-form-item label="是否特价" prop="isSpecialPrice">
              <el-select style="width: 240px;" v-model="form.isSpecialPrice">
                <el-option label="否" value="否"></el-option>
                <el-option label="是" value="是"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="合同金额" prop="totalAmount">
              <el-input style="width: 240px;" v-model="form.totalAmount"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        
        <!-- <el-row>
          <el-col :span="12">
            <el-form-item label="打包方式" prop="packingType">
              <el-select style="width: 240px;" v-model="form.packingType">
                <el-option label="整箱" value="整箱"></el-option>
                <el-option label="散装" value="散装"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="材质要求" prop="materialRequirements">
              <el-input style="width: 240px;" v-model="form.materialRequirements"></el-input>
            </el-form-item>
          </el-col>
        </el-row> -->
        
        <el-row>
          
        </el-row>
        
      <!--   <el-row>
          <el-col :span="12">
            <el-form-item label="正唛" prop="frontMarking">
              <ImageUpload v-model="form.frontMarking" :limit="1"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="侧唛" prop="backMarking">
              <ImageUpload v-model="form.backMarking" :limit="1"/>
            </el-form-item>
          </el-col>
        </el-row> -->
        
        
        
        <el-divider>订单信息明细</el-divider>
        
        <el-tabs v-model="activeNameForm" v-if="showCard">
      <el-tab-pane label="订单明细" name="first">
        <h2 align="center">{{ orderNo }}订单明细</h2>
        
        <el-row :gutter="10">
          <el-col :span="1.5">
            <el-button type="primary" size="mini" @click="handleAddComm">新增明细</el-button>
            <el-button type="info" size="mini" @click="handleCopyHistoryOrderComm">复制历史订单明细</el-button>
          </el-col>
        </el-row>
        
        <el-table :data="commdate">
          <el-table-column prop="id" label="序号" align="center" />
          <el-table-column label="产品描述" align="center">
            <el-table-column  prop="code" label="代号" align="center" />
            <el-table-column  prop="name" label="名称" align="center" />
            <el-table-column  prop="Spec" label="规格" align="center" />
            <el-table-column  prop="productType" label="产品类型" align="center" />
          </el-table-column>
          <el-table-column prop="productAttributes" label="产品属性" align="center" />
          <el-table-column prop="color" label="颜色" align="center" />
          <el-table-column prop="weight" label="单重" align="center" />
          <el-table-column prop="stitch" label="贴花方式" align="center" />
          <el-table-column prop="brand" label="商标" align="center" />
          <el-table-column label="促销" align="center" >
              <el-table-column prop="promotion" align="center" label="促销价" />
              <el-table-column prop="promotionstart" align="center" label="促销开始日期" />
              <el-table-column prop="promotionend" align="center" label="促销结束日期" />
          </el-table-column>
          <el-table-column prop="amount" label="装箱数" align="center" />
          <el-table-column prop="Mweight" label="毛重" align="center" />
          <el-table-column prop="netWeight" label="净重" align="center" />
          <el-table-column prop="grossWeight" label="体积" align="center" />
          <el-table-column prop="expiryDate" label="交货日期" align="center" />
          <el-table-column label="USD" align="center">
            <el-table-column  prop="usdPrice" label="单价(USD)" align="center" />
            <el-table-column  prop="usdAmount" label="金额(USD)" align="center" />
          </el-table-column>
          <el-table-column prop="deliveryDate" label="评审交期" align="center" />
          <el-table-column prop="sendGoods" label="已发货数" align="center" />
          <el-table-column prop="outbound" label="已出库数" align="center" />
          <el-table-column label="操作" width="150" fixed="right"  align="center" >
            <template slot-scope="scope">
              <el-button type="text" size="mini" @click="handleProductAttributes(scope.row)">设置产品属性</el-button>
              <el-button type="text" size="mini" @click="handleUpdateComm(scope.row)">修改</el-button>
              <el-button type="text" size="mini" @click="handleDeleteComm(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="订单明细要求" name="second">
        <el-row :gutter="20">
          <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
            <pane size="32">
            <el-tooltip placement="top">
              <div slot="content">单击任意一行列即可查看详情订单要求</div>
             <el-table :data="commdate" @row-click="handleDetailClick">
                  <el-table-column prop="code" label="代号" align="center" />
                  <el-table-column prop="name" label="名称" align="center" />
                  <el-table-column prop="Spec" label="规格" align="center" />
                  <el-table-column prop="customerNo" label="客户货号" align="center" />
                  <el-table-column prop="productType" label="产品类型" align="center" />
              </el-table>
              </el-tooltip>
          </pane>
            <pane size="64">
              <el-row :gutter="10" class="mb8">
                <el-col :push='1' :span="1.5">
                  <el-button type="primary" size="mini" @click="handleAddSave">保存</el-button>
                </el-col>
              </el-row>
              <el-form ref="formOrderDetail" :model="formOrderDetail" label-width="80px">
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="产品组成" prop="productComposition">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                       <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails('产品组成','productComposition',formOrderDetail.productComposition)"></el-button>
                      </el-tooltip>
                      <el-input type="textarea" v-model="formOrderDetail.productComposition"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="包装要求" prop="packageRequirements">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                      <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails('包装要求','packageRequirements',formOrderDetail.packageRequirements)"></el-button>
                     </el-tooltip>
                        <el-input type="textarea" v-model="formOrderDetail.packageRequirements"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                
                <el-row>
                 <el-col :span="12">
                   <el-form-item label="品质要求" prop="qualityRequirements">
                    <el-tooltip content="针对所有明细产品同样设置" placement="top">
                      <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails('品质要求','qualityRequirements',formOrderDetail.qualityRequirements)"></el-button>
                     </el-tooltip>
                     <el-input type="textarea" v-model="formOrderDetail.qualityRequirements"></el-input>
                   </el-form-item>
                 </el-col>
                 <el-col :span="12">
                  
                   <el-form-item label="英文包装要求" prop="englishPackageRequirements">
                    <el-tooltip content="针对所有明细产品同样设置" placement="top">
                      <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails('英文包装要求','englishPackageRequirements',formOrderDetail.englishPackageRequirements)"></el-button>
                     </el-tooltip>
                     <el-input type="textarea" v-model="formOrderDetail.englishPackageRequirements"></el-input>
                   </el-form-item>
                 </el-col>
                </el-row>
                
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="封口方式" prop="sealingMethod">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                        <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails('封口方式','sealingMethod',formOrderDetail.sealingMethod)"></el-button>
                      </el-tooltip>
                      <el-input type="textarea" v-model="formOrderDetail.sealingMethod"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="打包方式" prop="packingMethod">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                        <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails( '打包方式','packingMethod',formOrderDetail.packingMethod)"></el-button>
                      </el-tooltip>
                      <el-input type="textarea" v-model="formOrderDetail.packingMethod"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="唛头" prop="marking">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                        <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails( '唛头','marking',formOrderDetail.marking)"></el-button>
                      </el-tooltip>
                      <el-input type="textarea" v-model="formOrderDetail.marking"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="纸箱材质" prop="paperMaterial">
                      <el-tooltip content="针对所有明细产品同样设置" placement="top">
                        <el-button type="primary" size="mini" icon="el-icon-s-tools" @click="applyToAllDetails( '纸箱材质','paperMaterial',formOrderDetail.paperMaterial)"></el-button>
                      </el-tooltip>
                      <el-input type="textarea" v-model="formOrderDetail.paperMaterial"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
    
                
               </el-form>
            </pane>
          </splitpanes>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="产品图片" name="third">
        <el-row :gutter="20">
          <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
            <pane size="48">
              <el-table :data="commdate" @row-click="handleImgClick">
                  <el-table-column prop="code" label="代号" align="center" />
                  <el-table-column prop="name" label="名称" align="center" />
                  <el-table-column prop="Spec" label="规格" align="center" />
                  <el-table-column prop="customerNo" label="客户货号" align="center" />
                  <el-table-column prop="productType" label="产品类型" align="center" />
              </el-table>
            </pane>
            <pane size="48"> 
              <el-form ref="formImg" :model="formImg" label-width="80px">
                <el-form-item prop="img">
                   <ImageUpload v-model="img" /> 
                </el-form-item>
              </el-form>
            </pane>
          </splitpanes>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="物料清单设置" name="fourth">
        <el-row :gutter="20">
          <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
            <pane size="32">
              <el-table :data="commdate" @row-click="handleBOMClick">
                  <el-table-column prop="code" label="代号" align="center" />
                  <el-table-column prop="name" label="名称" align="center" />
                  <el-table-column prop="Spec" label="规格" align="center" />
                  <el-table-column prop="customerNo" label="客户货号" align="center" />
                  <el-table-column prop="productType" label="产品类型" align="center" />
                  <el-table-column label="操作" fixed="right"  align="center" >
                    <template slot-scope="scope">
                      <el-button type="text" size="mini" @click="handleAddBOM(scope.row)">生成订单BOM</el-button>
                    </template>
                  </el-table-column>
              </el-table>
              
              <el-row style="margin-top: 20px;" :gutter="10" class="mb8">
                <el-col :push="12" :span="1.5">
                  <el-button type="primary" size="mini" @click="handleGenerateBOM">一键生成BOM</el-button>
                </el-col>
              </el-row>
              
            </pane>
            <pane size="64">
              <el-row>
                <el-col :span="1.5">
                  <el-button type="primary" size="mini" @click="handleAddMaterial">新增物料</el-button>
                </el-col>
              </el-row>
              <el-table :data="materialData">
                <el-table-column label="物品描述" align="center" >
                  <el-table-column prop="code" label="代号" align="center" />
                  <el-table-column prop="name" label="名称" align="center" />
                  <el-table-column prop="quantity" label="材质" align="center" />
                  <el-table-column prop="unit" label="单位" align="center" />
                </el-table-column>
                <el-table-column  label="尺寸" align="center">
                  <el-table-column prop="length" label="长" align="center" />
                  <el-table-column prop="width" label="宽" align="center" />
                  <el-table-column prop="height" label="高" align="center" />
                </el-table-column>
                <el-table-column prop="productAttributes" label="产品属性" align="center" />
                <el-table-column prop="color" label="颜色" align="center" />
                <el-table-column prop="weight" label="单重" align="center" />
                <el-table-column prop="stitch" label="用量" align="center" />
                <el-table-column prop="deputiUnits" label="副单位" align="center" />
                <el-table-column prop="brand" label="花色" align="center" />
                <el-table-column prop="calculationDirection" label="计算方向" align="center" />
                <el-table-column label="操作" fixed="right"  align="center" >
                  <template slot-scope="scope">
                    <el-button type="text" size="mini" @click="handleEditMaterial(scope.row)">修改</el-button>
                    <el-button type="text" size="mini" @click="handleDeleteMaterial(scope.row)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </pane>
          </splitpanes>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="订单附件" name="fifth">
        <el-row :gutter="20">
          <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
            <pane size="64">
              <el-row :gutter="10" class="mb8">
                <el-col :span="1.5">
                  <el-button type="primary" size="mini" @click="handleAddFile">添加附件</el-button>
                </el-col>
              </el-row>
              <el-table :data="fileDate">
                  <el-table-column prop="fileNo" label="附件主题" align="center" />
                  <el-table-column prop="fileName" label="附件名称" align="center" />
                  <el-table-column prop="filePath" label="附件路径" align="center" >
                    <template slot-scope="scope">
                      <el-button size="mini" type="text" @click="handleDownload1(scope.row)">查看附件</el-button>
                    </template>
                  </el-table-column>
                  <el-table-column prop="fileType"  label="附件说明" align="center" />
                  <el-table-column label="附件操作" fixed="right"  align="center" >
                    <template slot-scope="scope">
                      <el-button type="text" size="mini" @click="handleFileDownload(scope.row)">下载</el-button>
                      <el-button type="text" size="mini" @click="handleFileDelete(scope.row)">删除</el-button>
                    </template>
                  </el-table-column>
              </el-table>
            </pane>
          </splitpanes>
        </el-row>
      </el-tab-pane>
      <el-tab-pane label="变更情况" name="sixth">
        <el-row :gutter="20">
          <splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
            <pane size="64">
              <el-row :gutter="10" class="mb8">
                <el-col :span="1.5">
                  <el-button type="primary" size="mini" @click="handleAdd">添加变更</el-button>
                </el-col>
              </el-row>
              <el-table :data="changeDate">
                  <el-table-column prop="changeNumber" label="变更次数" align="center" />
                  <el-table-column prop="changeNo" label="变更单号" align="center" />
                  <el-table-column prop="changeDate" label="变更日期" align="center" />
                  <el-table-column prop="changeModifier" label="变更人" align="center" />
                  <el-table-column prop="changeContent" label="变更内容" align="center" />
                  <el-table-column label="变更操作" fixed="right"  align="center" >
                    <template slot-scope="scope">
                      <el-button type="text" size="mini" @click="handleEditChange(scope.row)">修改</el-button>
                      <el-button type="text" size="mini" @click="handleDeleteChange(scope.row)">删除</el-button>
                    </template>
                  </el-table-column>
              </el-table>
            </pane>
          </splitpanes>
        </el-row>
      </el-tab-pane>
      
    </el-tabs>
        
        
       </el-form>
       <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitForm">确定</el-button>
          <el-button @click="cancel">取消</el-button>
       </div>
     </el-dialog>
    
    <!-- 订单明细 -->
     <el-dialog :title="titleComm" :visible.sync="openComm" width="1000px" append-to-body>
       <el-form ref="formComm" :model="formComm" label-width="80px">
        
        <el-row>
          <el-col :span="8">
            <el-form-item label="序号" prop="id">
              <el-input v-model="formComm.id"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="代号" prop="code">
              <el-input v-model="formComm.code"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="单重" prop="UnitWeight">
              <el-input v-model="formComm.UnitWeight"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row>
          <el-col :span="8">
            <el-form-item label="规格" prop="Spec">
              <el-input v-model="formComm.Spec"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="产品类型" prop="productType">
              <el-select v-model="formComm.productType">
                <el-option label="原材料" value="原材料"></el-option>
                <el-option label="辅料" value="辅料"></el-option>
                <el-option label="半成品" value="半成品"></el-option>
                <el-option label="成品" value="成品"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="交货日期" prop="expiryDate">
              <el-date-picker type="date" placeholder="选择日期" v-model="formComm.expiryDate"></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row>
          <el-col :span="8">
            <el-form-item label="产品属性" prop="productAttributes">
              <el-input v-model="formComm.productAttributes"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="颜色" prop="color">
              <el-input v-model="formComm.color"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="评审交期" prop="deliveryDate">
                <el-date-picker type="date" placeholder="选择日期" v-model="formComm.deliveryDate"></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row>
          <el-col :span="8">
            <el-form-item label="促销价" prop="promotion">
              <el-input v-model="formComm.promotion"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="促销开始日期" prop="promotionstart">
              <el-date-picker type="date" placeholder="选择日期" v-model="formComm.promotionstart"></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="促销结束日期" prop="promotionend">
              <el-date-picker type="date" placeholder="选择日期" v-model="formComm.promotionend"></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row>
          <el-col :span="8">
            <el-form-item label="贴花方式" prop="stitch">
              <el-select v-model="formComm.stitch">
                <el-option label="不贴花" value="不贴花"></el-option>
                <el-option label="贴花" value="贴花"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="商标" prop="brand">
              <el-input v-model="formComm.brand"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="装箱数" prop="amount">
              <el-input v-model="formComm.amount"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        
        
        <el-row>
          
           <el-col :span="8">
            <el-form-item label="体积" prop="grossWeight">
              <el-input v-model="formComm.grossWeight"></el-input>
            </el-form-item>
          </el-col>
           <el-col :span="8">
            <el-form-item label="毛重" prop="Mwight">
              <el-input v-model="formComm.Mwight"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="净重" prop="netWeight">
              <el-input v-model="formComm.netWeight"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row>
          
          <el-col :span="8">
            <el-form-item label="已发货数" prop="sendGoods">
              <el-input v-model="formComm.sendGoods"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="已出库数" prop="outbound">
              <el-input v-model="formComm.outbound"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row>
          <el-col :span="8">
             <el-form-item label="单价(USD)" prop="usdPrice">
                <el-input v-model="formComm.usdPrice"></el-input>
             </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="金额(USD)" prop="usdAmount">
              <el-input v-model="formComm.usdAmount"></el-input>
            </el-form-item>
          </el-col>
          
        </el-row>

       </el-form>
       <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitFormComm">确定</el-button>
          <el-button @click="cancelComm">取消</el-button>
       </div>
     </el-dialog>
    
    <!-- 订单明细要求 -->
     <el-dialog :title="titleOrderDetail" :visible.sync="openOrderDetail" width="800px" append-to-body>
       <el-form ref="formOrderDetail" :model="formOrderDetail" label-width="80px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="产品组成" prop="productComposition">
              <el-input type="textarea" v-model="formOrderDetail.productComposition"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="包装要求" prop="packageRequirements">
                <el-input type="textarea" v-model="formOrderDetail.packageRequirements"></el-input>
            </el-form-item>
          </el-col>
          
        </el-row>
        
        <el-row>
          <el-col :span="12">
            <el-form-item label="品质要求" prop="qualityRequirements">
              <el-input type="textarea" v-model="formOrderDetail.qualityRequirements"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="英文包装要求" prop="englishPackageRequirements">
                <el-input type="textarea" v-model="formOrderDetail.englishPackageRequirements"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
    
        
       </el-form>
       <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormOrderDetail">确定</el-button>
        <el-button @click="cancelOrderDetail">取消</el-button>
       </div>
     </el-dialog>
     
     <!-- 生成订单BOM弹窗 -->
      <el-dialog :title="titleBOM" :visible.sync="openBOM" width="800px" append-to-body>
       <el-form ref="formBOM" :model="formBOM" label-width="80px">
        <el-row :gutter="0">
          <el-col :span="4">
            <el-form-item label="光粉" prop="lightFinger">
              <el-checkbox v-model="formBOM.lightFinger"></el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="代号" prop="lightFingerCode">
              <el-input  v-model="formBOM.lightFingerCode" placeholder="请输入光粉代号"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="克重" prop="lightFingerWeight">
              <el-input v-model="formBOM.lightFingerWeight"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row :gutter="0">
          <el-col :span="4">
            <el-form-item label="原料" prop="rawMaterial">
              <el-checkbox v-model="formBOM.rawMaterial"></el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="代号" prop="rawMaterialCode">
              <el-input v-model="formBOM.rawMaterialCode" placeholder="请输入原料代号"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="克重" prop="rawMaterialWeight">
              <el-input v-model="formBOM.rawMaterialWeight"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row :gutter="0">
          <el-col :span="4">
            <el-form-item label="花纸" prop="paper">
              <el-checkbox v-model="formBOM.paper"></el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="8">
           <el-form-item label="花纸" prop="paperCode">
              <el-Select v-model="formBOM.paperCode" placeholder="请选择花纸">
                <el-option label="MF115#" value="MF115#"></el-option>
                <el-option label="MF118#" value="MF118#"></el-option>
                <el-option label="2484#" value="2484#"></el-option>
                <el-option label="TL218#" value="TL218#"></el-option>
                <el-option label="2479#" value="2479#"></el-option>
              </el-Select>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row :gutter="0">
          <el-col :span="4">
            <el-form-item label="纸箱" prop="box">
              <el-checkbox v-model="formBOM.box"></el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="长">
                <el-input v-model="formBOM.boxLength"  placeholder="请输入纸箱长度"></el-input>
            </el-form-item>
          </el-col>
           <el-col :span="6">
              <el-form-item  label="宽">
                <el-input v-model="formBOM.boxWidth" placeholder="请输入纸箱宽度"></el-input>
              </el-form-item>
           </el-col>
           <el-col :span="6">
            <el-form-item label="高">
                <el-input v-model="formBOM.boxHeight"  placeholder="请输入纸箱高"></el-input>
              </el-form-item>
           </el-col>
         <!--  <el-col :span="10">
            <el-form-item label="规格" prop="boxCode">
             <el-input v-model="formBOM.boxCode" placeholder="请输入纸箱规格(长*宽*高)"></el-input>
            </el-form-item>
          </el-col> -->
        </el-row>
        <el-row :gutter="0">
          
        </el-row>
        
        <el-row :gutter="0">
          <el-col :span="4">
            <el-form-item label="说明书" prop="instruction">
              <el-checkbox v-model="formBOM.instruction"></el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="彩标" prop="colorMark">
              <el-checkbox v-model="formBOM.colorMark"></el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="白纸" prop="whitePaper">
              <el-checkbox v-model="formBOM.whitePaper"></el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="条码" prop="barcode">
              <el-checkbox v-model="formBOM.barcode"></el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="OPP袋" prop="oppBag">
              <el-checkbox v-model="formBOM.oppBag"></el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="PE袋" prop="peBag">
              <el-checkbox v-model="formBOM.peBag"></el-checkbox>
            </el-form-item>
          </el-col>
        </el-row>
       </el-form>
       <div slot="footer" class="dialog-footer">
        
        <span style="margin-right: 120px;">
          <el-checkbox v-model="formBOM.createBom">是否对辅料建档</el-checkbox>
        </span>
        
         <el-button type="primary" @click="handleSubmitBOM">确定</el-button>
         <el-button @click="cencelBOM">取消</el-button>
       </div>
      </el-dialog>
      
      <!-- 物料清单弹窗 -->
       <el-dialog :title="titleMaterialList" :visible.sync="openMaterial" width="800px" append-to-body>
        <el-form ref="formMaterialList" :model="formMaterialList" label-width="80px">
          <el-row>
            <el-col :span="8">
              <el-form-item label="代号" prop="code">
                <el-input v-model="formMaterialList.code"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="名称" prop="name">
                <el-input v-model="formMaterialList.name"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="计算方向" prop="calculationDirection">
                <el-input v-model="formMaterialList.calculationDirection"></el-input>
              </el-form-item>
            </el-col>
            <!-- <el-col :span="8">
              <el-form-item label="规格" prop="Spec">
                <el-input v-model="formMaterialList.Spec"></el-input>
              </el-form-item>
            </el-col> -->
          </el-row>
          
          <el-row>
             <el-col :span="8">
              <el-form-item label="长" prop="length">
                <el-input v-model="formMaterialList.length"></el-input>
              </el-form-item>
              </el-col>
            <el-col :span="8">
              <el-form-item label="宽" prop="width">
                <el-input v-model="formMaterialList.width"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="高" prop="height">
                <el-input v-model="formMaterialList.height"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          
          <el-row>
            <el-col :span="8">
              <el-form-item label="材质" prop="quantity">
                <el-input v-model="formMaterialList.quantity"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="单位" prop="unit">
                <el-input v-model="formMaterialList.unit"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="颜色" prop="color">
                <el-input v-model="formMaterialList.color"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          
          <el-row>
            <el-col :span="8">
              <el-form-item label="单重" prop="weight">
                <el-input v-model="formMaterialList.weight"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="用量" prop="stitch">
                <el-input v-model="formMaterialList.stitch"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="副单位" prop="deputiUnits">
                <el-input v-model="formMaterialList.deputiUnits"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          
          
          
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="handleSubmitMaterialList">确定</el-button>
          <el-button @click="openMaterialList">取消</el-button>
        </div>
      </el-dialog>
      
      <!-- 订单图片上传弹窗 -->
      <el-dialog :title="titleImg" :visible.sync="openImg" width="800px" append-to-body></el-dialog>
    
    <!-- 附件上传弹窗 -->
    <el-dialog :title="titleFlie" :visible.sync="openFlie" width="500px" append-to-body>
        <el-form ref="formFlie" :model="formFlie" label-width="80px">
          <el-form-item label="附件主题" prop="fileNo">
            <el-input v-model="formFlie.fileNo"></el-input>
          </el-form-item>
          <el-form-item label="附件名称" prop="fileName">
            <el-input v-model="formFlie.fileName"></el-input>
          </el-form-item>
          <el-form-item label="附件说明" prop="fileType">
            <el-input type="textarea" v-model="formFlie.fileType"></el-input>
          </el-form-item>
          <el-form-item label="附件路径" prop="filePath">
            <FileUpload v-model="formFlie.filePath" @get-file-name="getFileName"></FileUpload>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="handleSubmitFlie">确定</el-button>
          <el-button @click="openFlie">取消</el-button>
        </div>
    </el-dialog>
    
    <!-- 变更情况 -->
     <el-dialog :title="titleChange" :visible.sync="openChange" width="500px" append-to-body>
        <el-form ref="formChange" :model="formChange" label-width="80px">
          <el-form-item label="变更次数" prop="changeNumber">
            <el-input v-model="formChange.changeNumber">
              <template slot="append">次</template>
            </el-input>
          </el-form-item>
          <el-form-item label="变更单号" prop="changeNo">
            <el-input v-model="formChange.changeNo"></el-input>
          </el-form-item>
          <el-form-item label="变更日期" prop="changeDate">
            <el-date-picker type="date" value-format="yyyy-MM-dd" placeholder="选择日期" v-model="formChange.changeDate"></el-date-picker>
          </el-form-item>
          <el-form-item label="变更人" prop="changeModifier">
            <el-select v-model="formChange.changeModifier">
              <el-option label="业务员A" value="业务员A"></el-option>
              <el-option label="业务员B" value="业务员B"></el-option>
              <el-option label="业务员C" value="业务员C"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="变更内容" prop="changeContent">
            <el-input type="textarea" v-model="formChange.changeContent"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitFormChange">确定</el-button>
          <el-button @click="cancelChange">取消</el-button>
        </div>
     </el-dialog>
     
     <!-- 产品属性 -->
      <el-dialog :title="titleProduct" :visible.sync="openProduct" width="1000px" append-to-body>
        <el-table :data="formattedProductData" :row-style="tableRowClassName"  @selection-change="handleSelectionChange" row-key="id" :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
          <el-table-column type="selection" width="55" align="center"></el-table-column>
          <el-table-column label="id" prop="id" v-if="false"></el-table-column>
          <el-table-column label="属性名称" prop="propertyName">
          </el-table-column>
        </el-table>
        <div slot="footer" class="dialog-footer">
            <div>{{this.selectedPropertyNames}}</div>
             <el-button type="primary" @click="close">关闭</el-button>
        </div>
      </el-dialog>
      
       <!-- 复制订单 -->
      <el-dialog :title="titleCopy" :visible.sync="openCopy" width="1000px" append-to-body>
        <el-table :data="orderdata" @selection-change="handleSelectionChangeCopy">
          <el-table-column type="selection" width="55" align="center"></el-table-column>
        <el-table-column align="center" label="订单编号" prop="orderNo"></el-table-column>
        <el-table-column align="center" label="类型" prop="orderType"></el-table-column>
        <el-table-column align="center" label="合同号" prop="contractNo"></el-table-column>
        <el-table-column align="center" label="客户合同号" width="150" prop="customerContractNo"></el-table-column>
        <el-table-column align="center" label="订单日期" prop="orderDate"></el-table-column>
        <el-table-column align="center" label="客户名称" prop="customer"></el-table-column>
        <el-table-column align="center" label="销售员" prop="saleman"></el-table-column>
        <el-table-column align="center" label="是否特价" prop="isSpecialPrice"></el-table-column>
        <el-table-column align="center" label="合同金额" prop="totalAmount"></el-table-column>
        <el-table-column align="center"  label="审核状态" prop="status"></el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormCopy">确定</el-button>
        <el-button @click="cancelCopy">取消</el-button>
      </div>
      </el-dialog>
      
      <!-- 复制订单明细 -->
       <el-dialog :title="titleOrderDetail" :visible.sync="openOrderDetail" width="1000px" append-to-body>
          <el-table :data="commdate" @selection-change="handleSelectionChangeDetail">
            <el-table-column type="selection" width="55" align="center"></el-table-column>
          <el-table-column prop="id" label="序号" align="center" />
          <el-table-column label="产品描述" align="center">
            <el-table-column  prop="code" label="代号" align="center" />
            <el-table-column  prop="name" label="名称" align="center" />
            <el-table-column  prop="Spec" label="规格" align="center" />
            <el-table-column  prop="productType" label="产品类型" align="center" />
          </el-table-column>
          <el-table-column prop="productAttributes" label="产品属性" align="center" />
          <el-table-column prop="color" label="颜色" align="center" />
          <el-table-column prop="weight" label="单重" align="center" />
          <el-table-column prop="stitch" label="贴花方式" align="center" />
          <el-table-column prop="brand" label="商标" align="center" />
          <el-table-column prop="amount" label="装箱数" align="center" />
          <el-table-column prop="Mweight" label="毛重" align="center" />
          <el-table-column prop="netWeight" label="净重" align="center" />
          <el-table-column prop="grossWeight" label="体积" align="center" />
          <el-table-column prop="expiryDate" label="交货日期" align="center" />
          <el-table-column label="USD" align="center">
            <el-table-column  prop="usdPrice" label="单价(USD)" align="center" />
            <el-table-column  prop="usdAmount" label="金额(USD)" align="center" />
          </el-table-column>
          <el-table-column prop="deliveryDate" label="评审交期" align="center" />
          <el-table-column prop="sendGoods" label="已发货数" align="center" />
          <el-table-column prop="outbound" label="已出库数" align="center" />
        </el-table>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitFormOrderDetail">确定</el-button>
          <el-button @click="cancelOrderDetail">取消</el-button>
        </div>
       </el-dialog>
    
    
  </div>
</template>
<script>
import { Splitpanes, Pane } from "splitpanes";
import "splitpanes/dist/splitpanes.css";
import {ImageUpload} from "@/components/ImageUpload"


export default {
 components:{
  Splitpanes,
   Pane
 },
  data() {
    return {
      // 订单
      title: '',
      open: false,
      form: {},
      
      // 标题
      titleFlie: '',
      titleChange: '',
      titleOrderDetail: '',
      titleComm: '',
      // 弹窗
      openFlie: false,
      openChange: false,
      openOrderDetail: false,
      openComm: false,
      // 表单
      formFlie: {},
      formChange: {},
      formOrderDetail: {},
      formComm: {},
      // 物料清单
      titleMaterialList: '',
      openMaterial: false,
      formMaterialList: {},
      // 产品属性
      openProduct: false,
      titleProduct: '',
      selectedProducts: [],  // 用于存储被勾选的行的产品属性
      selectedPropertyNames:[], // 用于存储被勾选的行的属性名称
      formattedProductData: [], // 用于格式化产品属性数据
      productData:[{
        id: 1,
        propertyName: '内销产品库用*成品类型属性',
      },{
        id: 2,
        propertyName: '外销产品库用*成品类型属性',
      },{
        id: 3,
        propertyName: '销售订单用*底标属性',
      },{
        id:4,
        propertyName: '销售订单用*密胺工艺属性',
        children: [{
          id: 5,
          propertyName: '双色外压花罩光',
        },{
          id: 6,
          propertyName: '双色外贴花罩光',
        },{
          id: 7,
          propertyName: '双色素面罩光',
        },{
          id: 8,
          propertyName: '双色双面压花罩光',
        },{
          id: 9,
          propertyName: '双色双面贴花罩光',
        },{
          id: 10,
          propertyName: '双色双面贴花步罩光',
        },{
          id: 11,
          propertyName: '单色外压花罩光',
        },{
          id: 12,
          propertyName: '单色外贴花罩光',
        },{
          id: 13,
          propertyName: '单色素面罩光',
        },{
          id: 14,
          propertyName: '单色双面压花罩光',
        },{
          id: 15,
          propertyName: '单色双面贴花罩光',
        },{
          id: 16,
          propertyName: '单色双面贴花步罩光',
        },{
          id: 17,
          propertyName: '单色素面罩光',
        },{
          id: 18,
          propertyName: '单色素面',
        }]
      }],
      
      formImg: {},
      
      orderNo: '',
      showCard: true,
      activeName: 'first',
      activeNameForm: 'first',
      orderdata: [{
               orderNo: 'NXDD1905150001',
        money: '100000',
        itemName: '果篮',
        contractNo: 'GX190503',
        customerContractNo: 'GX190503',
        orderDate: '2019-05-15',
        customer: '浙江运隆',
        saleman: '马颜颜',
        orderType: '内销',
        storageStatus: '未入库',
        deliveryStatus: '未发货',
        outboundStatus: '未出库',
        accountingStatus: '未记账',
        stopStatus: '未停止',
        status: '审核通过',
        reviewStatus: '待评审',
        isSpecialPrice: '是',   
      },{
       orderNo: 'NXDD1610030001',
        money: '150000',
        itemName: '椭圆形物盘',
        contractNo: 'ZX161001',
        customerContractNo: 'ZX161001',
        orderDate: '2016-10-03',
        customer: '石家庄市锦强',
        saleman: '周灵芝',
        orderType: '内销',
        storageStatus: '未入库',
        deliveryStatus: '未发货',
        outboundStatus: '未出库',
        accountingStatus: '未记账',
        stopStatus: '未停止',
        status: '审核通过',
        reviewStatus: '待评审',
        isSpecialPrice: '是',
      
      }],
      total: 0,
      loading: false,
      
      radio: 3,
      queryParams: {
        date1: '',
        date2: '',
        radio: 3,
        radio1: 3,
        radio2: 3,
        radio3: 3,
        radio4: 3,
        radio5: 3,
      },
      
        
      
      // 明细
      commdate: [{
        id: 1,
        code: 'YL083610',
        name: '果篮',
        Spec: '10*10*10',
        customerNo: 'YL083610',
        productType: '密胺',
        unit:'个',
        productAttributes:'高硬度，耐磨性好，表面有防滑处理',
        color:'深棕色',
        weight:'320',
        stitch:'数码印刷（复杂图案）',
        amount: '24',
        batch:'',
        batchNumber:'',
        batchDate:'',
        deliveryDate:'2019-06-30',
        sendGoods:'100',
        outbound:'150',
        expiryDate:'2019-06-30',
        promotion:'21.03(买五送一)',
          promotionstart:'2024 - 01 - 01',
          promotionend:'2024 - 01 - 31',
          Mweight:'8克',
          netWeight:'7.68克',
          grossWeight:'0.0216',
          usdPrice:'21.03',
          usdAmount:'2103',
        img:[
        'https://img.alicdn.com/imgextra/i2/651297984/TB27uXWrVXXXXXqXpXXXXXXXXXX_!!651297984.jpg',
        'https://img.alicdn.com/imgextra/i4/651297984/TB2Je0JrVXXXXcbXpXXXXXXXXXX_!!651297984.jpg',
        'https://bpic.588ku.com/element_origin_min_pic/21/10/12/d89b38b9266c8905910961914f28891f.jpg'
       ],
        "productComposition": "产品由主材料A和辅助材料B组成，比例为3:1。",
        "packageRequirements": "要求使用环保材料包装，每个产品需独立包装。",
        "qualityRequirements": "产品质量需达到国家标准，无瑕疵，外观整洁。",
        "englishPackageRequirements": "Packaging should be made of eco-friendly materials, with each product individually wrapped.",
        "sealingMethod": "采用热封技术，确保密封性良好。",
        "packingMethod": "每10个产品装入一个纸箱，纸箱需防潮处理。",
        "marking": "唛头需包含产品名称、生产日期和批次号。",
        "paperMaterial": "纸箱材质为高强度瓦楞纸板，承重能力不低于5公斤。"
      },{
        id: 2,
        code: 'ZX161001',
        name: '椭圆形物盘',
        Spec: '1.5*1.5*0.2',
        customerNo: 'ZX161001',
        productType: '密胺',
        unit:'个',
        productAttributes:'符合FDA食品级标准,耐温 -20℃至120℃,表面光滑易清洁',
        color:'纯白色',
        weight:'210',
        stitch:'热转印(品牌logo)',
        amount: '12',
        batch:'',
        batchNumber:'',
        batchDate:'',
         deliveryDate:'2019-06-30',
        sendGoods:'100',
        outbound:'150',
        expiryDate:'2016-11-07',
         promotion:'20.00(满10件打9折)',
          promotionstart:'2024 - 01 - 01',
          promotionend:'2024 - 01 - 31',
           Mweight:'7克',
          netWeight:'6.59克',
          grossWeight:'0.0314',
          usdPrice:'24.98',
          usdAmount:'4355',
        img:[
          'https://imgs.zsbeike.com/imgs/B/B01080/b01080.0607.5.jpg',
          'https://cbu01.alicdn.com/img/ibank/2018/042/316/9358613240_759519532.jpg',
          'https://cbu01.alicdn.com/img/ibank/2020/441/212/16826212144_156162224.jpg'
        ],
        "productComposition": "产品主要由天然橡胶和合成树脂制成,比例为2:1。",
        "packageRequirements": "包装需防震、防潮，并附带产品说明书。",
        "qualityRequirements": "产品质量需达到国际ISO标准,表面光滑,无气泡和裂纹。",
        "englishPackageRequirements": "Packaging should be shockproof, moisture-proof, and include a product manual.",
        "sealingMethod": "使用冷封技术，确保密封的同时不影响产品外观。",
        "packingMethod": "每5个产品装入一个塑料袋,再统一装入纸箱,纸箱内需放置干燥剂。",
        "marking": "唛头需包含品牌标识、产品型号和出口国信息。",
        "paperMaterial": "纸箱采用环保再生纸板,承重能力不低于3公斤,需符合欧盟环保标准。"
      }],
      // 附件
      fileDate:[{
        fileNo: '果篮',
        fileName: '果篮.pdf',
        filePath: 'https://erpmes.oss-cn-beijing.aliyuncs.com/1610151142321.pdf',
        fileType: '产品说明'
      },{
        fileNo: '椭圆形托盘',
        fileName: '椭圆形托盘.pdf',
        filePath: 'https://erpmes.oss-cn-beijing.aliyuncs.com/1610151142321.pdf',
        fileType: '产品说明'
      }],
       // 变更情况
      changeDate:[{
        changeNumber: '1',
        changeNo: '20210101001',
        changeDate: '2019-05-21',
        changeModifier: '马颜颜',
        changeContent: '产品A的数量由100000改为120000'
      },{
        changeNumber: '2',
        changeNo: '20210101002',
        changeDate: '2016-10-12',
        changeModifier: '周灵芝',
        changeContent: '产品A的数量由120000改为140000'
      },],
     //quantity: [{}],
      // 物料清单设置
      materialData:[{
        code: 'A1-40137',
        name: '花纸',
        quantity:'木浆纸',
        unit:'采购部',
        length:'0.8',
        width:'1.2',
        height:'1.2',
        weight:'0.7g',
        stitch:'30',
        deputiUnits:'kg',
        brand:'桃红色',
        calculationDirection:'正向',
        attribute: '优良',
        contractNo: '130405',
        productAttributes:'韧性',
        batchNo: '24KG/包',
        storageLocation: '自购',
        warehouse: '余姚市舜吉塑化有限公司',
        currentInventory: '3000',
        unit: '克(g)',
        goodProduct: '800000g',
        unitPrice: '1.8元',  
        taxPrice: '4元',
        floatingRatio:'5%',
        type:'油亮',
        cotegoryName:'油亮花纸',
        barcode:'295239523923',
        conversionRate:'45%',
        color:'淡黄色',
        
      }
      ],
      form: {},
      showSearch: true,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        date1: '',
        date2: '',
      },
      img:[],
      // 图片
      titleImg: '',
      openImg: false,
      
      flag:false,
      // 订单BOM
      titleBOM: '',
      openBOM: false,
      formBOM: {},
     bomMappings: {
      lightFinger: { code: 'GF', name: '光粉', spec: '25kg/袋', unit: '千克',weight: '25kg' },
      rawMaterial: { code: 'YL', name: '原料', spec: '标准', unit: '吨' },
      paper: { code: 'HZ', name: '花纸', spec: 'A4尺寸', unit: '卷',brand:'' },
      box: { code: 'ZX', name: '纸箱', spec: '50×50×50cm', unit: '个' },
      barcode: { code: 'TM', name: '条码', spec: '标准', unit: '张' },
      oppBag: { code: 'OPP', name: 'OPP袋', spec: '30×40cm', unit: '个' },
      peBag: { code: 'PE', name: 'PE袋', spec: '20×30cm', unit: '个' },
      instruction: { code: 'SM', name: '说明书', spec: 'A5尺寸', unit: '份' },
      colorMark: { code: 'CB', name: '彩标', spec: '标准', unit: '张' },
      whitePaper: { code: 'BZ', name: '白纸', spec: 'A4尺寸', unit: '张' }
      },
       // 复制订单
      selectedProductsCopy: [],
      titleCopy: '复制订单',
      openCopy: false,
      // 复制订单明细
      selectedProductsCopyDetail: [],
      titleCopyDetail: '复制订单明细',
      openCopyDetail: false,
    }
  },
  created() {
    this.handleImgClick(this.commdate[0]);
  },
  mounted() {
    this.formatProductData();
  },
  methods: {
    // 显示高亮
    rowClassName({ row }) {
      return row.orderNo == this.orderNo ? 'selected-row' : ''; // 判断是否选中
    },
    // 一键生成所以BOM
    handleGenerateBOM(){
      this.$confirm('是否一键生成所有订单的BOM?','提示',{
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        const keys = Object.keys(this.bomMappings);
        keys.forEach(key => {
          this.formBOM[key] = true;
        })
        
      this.handleSubmitBOM();
      }).catch(() => {
         this.$message.error('取消操作!')
      })
    },
    // 是否针对所以订单
    applyToAllDetails(name,index,data){
      console.log(name,index ,data);
      this.$confirm('是否对'+ name +'针对所以订单设置?','提示',{
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.commdate.forEach(item => {
          console.log(item);
          if(item == index){
            item.productAttributes = data;
          }
        })
        this.$message.success('操作成功!')
      }). catch(() => {
        this.$message.error('取消操作!')
      })
    },
    formatProductData() {
      // 递归函数，用于添加 `isChild` 属性
      const addChildFlag = (nodes, isChild = false) => {
        return nodes.map(node => {
          const newNode = { ...node, isChild };
          if (newNode.children && newNode.children.length > 0) {
            newNode.children = addChildFlag(newNode.children, true);
          }
          return newNode;
        });
      };
      this.formattedProductData = addChildFlag(this.productData);
      console.log(this.formattedProductData);
    },
    tableRowClassName({row}) {
      console.log(row);
      if(row.isChild){
        return { background: 'skyblue' };
      } else{
        return '';
      }
    },
    
    // 产品属性
    handleProductAttributes(row){
      this.formComm = row;
      this.openProduct = true;
      this.titleProduct = '产品属性';
    },
    
    // 获取勾选的产品属性
    handleSelectionChange(val) {
      // val 是被勾选的行的数据数组
      this.selectedProducts = val;
      // 如果你想获取被勾选的行的属性名称，可以这样做：
      this.selectedPropertyNames = this.selectedProducts.map(item => item.propertyName);
      console.log('被勾选的属性名称:', this.selectedPropertyNames);
    },
    
    // 关闭产品属性弹窗
    close(){
     this.formComm.productAttributes =  this.selectedPropertyNames.splice(',')
      this.commdate.splice(this.commdate.indexOf(this.formComm), 1, this.formComm);
      this.openProduct = false;
      
    },
    
    changeBox() {
      this.formBOM.boxCode = `${this.formBOM.boxHeight}*${this.formBOM.boxWidth}*${this.formBOM.boxDepth}`;
    },
    
    handleBOMClick(row){
      console.log(row);
      
    },
    // 显示明细要求
    handleDetailClick(row) {
      this.formOrderDetail = row;
      
    },
    // 新增物料
    handleAddMaterial() {
      this.titleMaterialList = '新增物料';
      this.openMaterial = true;
    },
    // 修改物料
    handleEditMaterial(row) {
      this.titleMaterialList = '修改物料';
      this.openMaterial = true;
      this.formMaterialList = row;
    },
    openMaterialList(){
      this.openMaterial = false;
    },
    // 删除物料
    handleDeleteMaterial(row) {
      this.$confirm('确定删除该物料？')
      .then(() =>{
        this.materialData.splice(this.materialData.indexOf(row), 1)
        this.$message.success('删除成功!')
      }).catch(() => {
        this.$message.error('取消删除!')
      })
    },
    // 物料提交
    handleSubmitMaterialList() {
      this.$refs.formMaterialList.validate((valid) => {
        if (valid) {
          if(this.titleMaterialList == '新增物料'){
            this.materialData.push(this.formMaterialList);
            this.$message.success('新增物料成功!')
          } else if(this.titleMaterialList == '修改物料'){
            this.materialData.splice(this.materialData.indexOf(this.formMaterialList), 1, this.formMaterialList);
            this.$message.success('修改物料成功!')
          }
          this.openMaterial = false;
        }
    }) 
    },
    // 物料取消
    cencelBOM() {
      this.openBOM = false;
    },
    // 生成订单BOM
    handleAddBOM() {
      this.openBOM = true;
      this.titleBOM = '生成订单BOM';
    },
    handleSubmitBOM() {
  // 生成唯一ID
  const generateId = () => Date.now().toString(36) + Math.random().toString(36).substr(2)
  // 遍历所有选中的BOM项
  Object.entries(this.formBOM).forEach(([key, value]) => {
    if (value && this.bomMappings[key]) {
      let bomItem = {
        ...this.bomMappings[key],
        id: generateId(),
        code: `${this.bomMappings[key].code}-${Math.floor(100 + Math.random() * 900)}`,
        quantity: 1, // 默认数量
        productAttributes: '',
        color: '',
        weight: '',
        stitch: '1',
        deputiUnits: '1',
        calculationDirection: '乘以数量'
      }
      
      // 处理光粉特殊字段
      if (key === 'lightFinger') {
        bomItem = {
          ...bomItem,
          code: this.formBOM.lightFingerCode || bomItem.code,  // 使用用户输入或默认值
          weight: this.formBOM.lightFingerWeight ? `${this.formBOM.lightFingerWeight}g` : '',
        }
      }
      // 处理原料特殊字段
      if (key === 'rawMaterial') {
        bomItem = {
          ...bomItem,
          code: this.formBOM.rawMaterialCode || bomItem.code,  // 使用用户输入或默认值
          weight: this.formBOM.rawMaterialWeight ? `${this.formBOM.rawMaterialWeight}g` : '',
        }
      }
      if (key === 'paper') {
        bomItem = {
          ...bomItem,
          brand: this.formBOM.paperCode || '',  // 使用用户输入或默认值
        }
      }
      if (key === 'box') {
        bomItem = {
          ...bomItem,
          length: this.formBOM.boxLength || '',  // 使用用户输入或默认值
          width: this.formBOM.boxWidth || '',  // 使用用户输入或默认值
          height: this.formBOM.boxHeight || '',  // 使用用户输入或默认值
        }
      }
      
      // 检查是否已存在相同物料
      const exists = this.materialData.some(item => 
        item.name === bomItem.name && 
        item.quantity === bomItem.quantity
      )
      
      if (!exists) {
        this.materialData.push({
          ...bomItem,
          Spec: bomItem.spec // 匹配原有字段名
        })
      }
    }
  })

  this.$message.success('BOM生成成功!')
  this.openBOM = false
    },
    // 反审核
    handleDetail(row) {
      this.$confirm('确定反审核该订单？')
      .then(() =>{
        row.status = '待审核';
        this.$message.success('反审核成功!')  
      }).catch(() => {
        this.$message.error('取消反审核!')
      })
    },
    
    // 审核
    handleReview(row) {
      this.$confirm('确定审核该订单？')
      .then(() =>{
        row.status = '审核通过';
        this.$message.success('审核成功!')  
      }).catch(() => {
        this.$message.error('取消审核!')
      })
    },
    
    handleImgClick(row){
      console.log(row);
      this.formOrderDetail = row;
      this.img = row.img;
    },
    
    // 订单新增
    handleAdd() {
      this.title = '新增订单';
      this.open = true;
    },
    // 订单修改
    handleUpdate(row) {
      this.title = '修改订单';
      this.open = true;
      this.form = row;
    },
    // 订单提交
    submitForm() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.$message.success('提交成功!');
          this.open = false;
        }
    }) 
    },
    /**
     * 要做跳转到生成任务单页面
     */
    handleGenerateTask(){
      console.log(this.flag);
      if(this.flag){
        this.$alert("审核通过后才能生成任务单",'警告',{
          confirmButtonText: '确定',
          type: 'info'
        })
        return;
      }
      this.$confirm('是否生成任务单？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$router.push("/produce/productionTasks")
        this.$message({
          type:'success',
          message: '任务单生成成功!'
        })
      }).catch(() => {
        this.$message.error('任务单生成失败!')
      })
    },
    // 订单取消
    cancel() {
      this.open = false;
    },
    // 订单删除
    handleDelete(row) {
      this.$confirm('确定删除该订单？')
      .then(() =>{
        this.orderdata.splice(this.orderdata.indexOf(row), 1)
        this.$message.success('删除成功!')
      }).catch(() => {
        this.$message.error('取消删除!')
      })
    },
    
    // 订单明细
    handleAddComm() {
      this.titleComm = '添加订单明细';
      this.openComm = true;
    },
    handleUpdateComm(row) {
      this.openComm = true;
      this.titleComm = '修改订单明细';
      this.formComm = row;
    },
    handleDeleteComm(row) {
      this.$confirm('确定删除该订单明细？')
      .then(() =>{
        this.commdate.splice(this.commdate.indexOf(row), 1)
        this.$message.success('删除成功!')
      }).catch(() => {
        this.$message.error('取消删除!')
      })
    },
    // 订单明细提交
    submitFormComm() {
      this.$refs.formComm.validate((valid) => {
        if (valid) {
          if(this.titleComm == '添加订单明细'){
            this.commdate.push(this.formComm);
            this.$message.success('新增订单明细成功!')
          } else if(this.titleComm == '修改订单明细'){
            this.commdate.splice(this.commdate.indexOf(this.formComm), 1, this.formComm);
            this.$message.success('修改订单明细成功!')
          }
          this.openComm = false;
        }
    }) 
    },
    // 订单明细取消
    cancelComm() {
      this.openComm = false;
    },
    
    // 订单明细要求打开
    handleOrderDetail(){
      this.openOrderDetail = true;
    },
    // 订单明细要求提交
    submitFormOrderDetail() {
      this.$refs.formOrderDetail.validate((valid) => {
        if (valid) {
          this.$message.success('提交成功!');
          this.openOrderDetail = false;
        }
    }) 
    },
    // 订单明细要求取消
    cancelOrderDetail() {
      this.openOrderDetail = false;
    },
     
    showTab(row) {
      if(row.status == '待审核'){
        this.flag = true;
      } else {
        this.flag = false;
      }
      this.orderNo = row.orderNo;
      this.showCard = true;
    },
    // 文件名称
    getFileName(fileName) {
      this.formFlie.fileName = fileName;
    },
    
    // 订单附件
    handleAddFile() {
      this.openFlie = true;
      this.titleFlie = '添加附件';
    },
    handleSubmitFlie() {
      this.$refs.formFlie.validate((valid) => {
        if (valid) {
          this.$message.success('提交成功!');
          this.openFlie = false;
        }
    }) 
    },
    // 查看附件
    handleDownload1(row) {
      if (row.filePath) {
        window.open(row.filePath);
      } else {
        this.$message.error('当前附件不存在!');
      }
    },
    resetQuery() {},
    // 下载附件
    handleFileDownload(row){
      console.log(row);
      
      if(row.filePath){
        this.$download.resource(row.filePath)
      } else {
        this.$message.error('当前附件不存在!')
      }
    },
    handleFileDelete(row) {
      this.$confirm('确定删除该附件？')
      .then(() =>{
        this.fileDate.splice(this.fileDate.indexOf(row), 1)
        this.$message.success('删除成功!')
      }).catch(() => {
        this.$message.error('取消删除!')
      })
    },
    
    // 变更情况
    handleAddChange() {
      this.openChange = true;
      this.titleChange = '添加变更';
    },
    handleEditChange(row) {
      this.openChange = true;
      this.titleChange = '修改变更';
      this.formChange = row;
    },
    submitFormChange() {
      this.$refs.formChange.validate((valid) => {
        if (valid) {
          this.$message.success('提交成功!');
          this.openChange = false;
        }
    }) 
    },
    cancelChange() {
      this.openChange = false;
    },
    // 删除变更
    handleDeleteChange(row) {
      this.$confirm('确定删除该变更？')
      .then(() =>{
        this.changeDate.splice(this.changeDate.indexOf(row), 1)
        this.$message.success('删除成功!')
      }).catch(() => {
        this.$message.error('取消删除!')
      })
    },
    handleQuery() {},
    handleReset() {},
    handleExport() {},
    handleAddSave() {},
    getList(){},
     // 复制历史订单明细
    handleSelectionChangeDetail(val){
      this.selectedProductsDetail = val;
    },
    handleCopyHistoryOrderComm(){
      /* this.$confirm('确定复制该订单明细？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.openOrderDetail = true;
      }) */
      this.openOrderDetail = true;
    },
    submitFormOrderDetail(){
      this.$confirm('确定复制该订单明细？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let List = this.selectedProductsDetail.map(item => {
          return JSON.parse(JSON.stringify(item))
        })
      this.commdate.push(...List);
      this.openOrderDetail = false;
      this.$message.success('复制成功!')
      this.selectedProductsDetail = [];
      }
      ).catch(() => {
        this.$message.error('取消复制!')
      })
    },
    cancelCopyOrderDetail(){
      this.openOrderDetail = false;
    },
    // 复制历史订单
     handleSelectionChangeCopy(val) {
      // val 是被勾选的行的数据数组
      this.selectedProductsCopy = val;
      // 如果你想获取被勾选的行的属性名称，可以这样做：
    },
    handleCopyHistoryOrder(){
      /* this.$confirm('确定复制该订单？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.openCopy = true;
      }) */
     this.openCopy = true;
    },
    submitFormCopy(){
      this.$confirm('确定复制该订单？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let List =  this.selectedProductsCopy.map(item => {
         return JSON.parse(JSON.stringify(item))
      })
      this.orderdata.push(...List);
      this.openCopy = false;
      this.$message.success('复制成功!')
      this.selectedProductsCopy = [];
      })
    
    },
    cancelCopy(){
      this.openCopy = false;
    },
    handleExport(){
      this.$message.success('导出成功!')
      console.log(this.orderdata);
    }
    
  }
}
</script>

<style>
.radio-group .el-radio {
  margin-right: 0px;
}

.radio-group {
  border-radius: 1px;
  border: 1px solid #dcdfe6;
}
.child-row {
  /* 为子级行的单元格添加背景颜色 */
  background-color: #e2562b; /* 或其他你想要的颜色 */
}
.selected-row {
  background-color: yellow !important;
  /* 选中行的背景颜色 */
}
</style>
